<script>

export default {
  name: "Login.vue",
  data() {
    return {
      input: '',
      input1: ''
    }
  }
}
</script>

<template>
  <div style="height: 100vh;display: flex;align-items: center;justify-content: center;background-color: #0f9876">
    <div style="display: flex;background-color: white; width: 50%;border-radius: 5px;overflow: hidden">
      <div style="flex: 1">
          <img src="@/assets/css/3.png" alt="" style="width: 100% ;">
      </div>
      <div style="flex: 1; display:flex; align-items: center">
        <el-form >
          <div style="font-size: 35px; font-weight: bold;text-align: center; margin-bottom: 20px">欢迎登陆后台管理系统</div>
          <el-form-item prop="username">
            <el-input clearable v-model="input" prefix-icon="el-icon-user" size="medium" placeholder="请输入账号"></el-input>
          </el-form-item>
          <el-form-item prop="password">
            <el-input clearable show-password v-model="input1" prefix-icon="el-icon-lock" placeholder="请输入密码"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" style="width: 100%">登录</el-button>
          </el-form-item>
          <div style="display: flex">
            <div style="flex: 1">还没有账号？请<span style="color: #0f9876;cursor: pointer">注册</span></div>
            <div style="flex: 1;text-align: right"><span style="color: #0f9876;cursor: pointer">忘记密码?</span></div>
          </div>

        </el-form>
      </div>

    </div>

  </div>

</template>
